{extend name="public/layer_base"}

{block name="style"}
{js href="__PUBLIC__static/admin/lib/cropper/cropper.min.css"}
{/block}

{block name="main"}
<form action="{:url('save_banner')}" method="post" class="form form-horizontal" id="form-send" enctype="multipart/form-data">
    <div class="row cl">
        <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>banner名称：</label>
        <div class="formControls col-xs-8 col-sm-9">
            <input type="text" class="input-text" name="name" value="{$data.name|default=''}">
        </div>
    </div>
    <div class="row cl">
        <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>跳转链接：</label>
        <div class="formControls col-xs-8 col-sm-9">
            <input type="text" class="input-text" name="url" value="{$data.url|default=''}" placeholder="http://开头，不填则不跳转">
        </div>
    </div>
    <div class="row cl">
        <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>图片：</label>
        <div class="formControls col-xs-8 col-sm-9">
            <div class="col-md-6 l_image" style="padding: 0">
                <div class="img-preview img-preview-sm mb-20">
                    <img src="__PUBLIC__{$data.image|default=''}" style="width: 100%; height: 100%" />
                </div>
            </div>
            <div class="col-md-6 r_image" style="padding: 0">
                <div class="image-crop">
                    <img src="">
                </div>
                <div class="btn-group mt-20">
                    <label title="Upload image file" for="inputImage" class="btn btn-primary">
                        <input type="file" accept="image/*" id="inputImage" class="hide">
                        选择图片
                    </label>
                    <label title="Donload image" id="download" class="btn btn-warning">确认选择</label>
                    <label title="Donload image" id="image_close" class="btn btn-danger">取消</label>
                </div>
                <canvas id="myCanvas" style="display:none"></canvas>
            </div>
        </div>
    </div>
    <div class="row cl">
        <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
            <button class="btn btn-primary radius" type="submit"><i class="Hui-iconfont">&#xe632;</i> 保存并提交</button>
            <button onClick="layer_close();" class="btn btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</button>
        </div>
    </div>
    <input type="hidden" name="image" value="{$data.image|default=''}" />
    <input type="hidden" name="id" value="{$data.id|default='0'}" />
    <input type="hidden" name="__token__" value="{$Request.token}" />
</form>
{/block}

{block name="javascript"}

<script>
    SCOPE.cropper_aspect_ratio = 5.12;
    SCOPE.image_type = 'banner';
</script>
{/block}